<template>
    <div>
      <el-cascader
        :options="transformedOptions"
        v-model="selectedOptions"
        @change="handleChange"
      ></el-cascader>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        // 假设这是从服务器接收到的数据
        originalData: [
          { id: 56, mdBuyPrice: 15, mdDrugStoreId: "DRUS01", mdName: "999感冒灵", mdNum: 3, mdPrescriptionId: "1315865106541707264" },
          { id: 57, mdBuyPrice: 16, mdDrugStoreId: "DRUS00", mdName: "999灵", mdNum: 3, mdPrescriptionId: "13158651065417072653" }
        ],
        transformedOptions: [], // 将会存储转换后的数据
        selectedOptions: [] // 用于存储用户的选择
      };
    },
    methods: {
      // 方法：转换原始数据以适应 el-cascader
      transformData(data) {
        return data.map(item => ({
          value: item.mdName, // 一级选项的值
          label: item.mdName, // 一级选项的标签
          children: [{ // 二级选项
            value: item.mdNum,
            label: `库存: ${item.mdNum}`
          }]
        }));
      },
      handleChange(value) {
        console.log('Selected:', value);
      }
    },
    mounted() {
      // 组件挂载后调用此方法进行数据转换
      this.transformedOptions = this.transformData(this.originalData);
    }
  };
  </script>
  
  <style scoped>
  /* 你可以在这里添加样式 */
  </style>